import React, { Component } from 'react'
import { withRouter } from "react-router-dom";
import './Personage.scss'
import Upload from '../../Common/UpLoad'

class Personage extends Component {
	state = {
		imgLogo: "../../../assets/images/icon/crown_icon.png",
		userLogo: require('../../../assets/userlogo.png')
	}
	goWish=()=>{
		this.props.history.push('/wish')
	}
	goHis = () => {
		this.props.history.push('/history')
	}
	goCom = () => {
		this.props.history.push('/comrecord')
	}
	render() {
		let { username, record, wish, userImg, comment } = this.props
		let { imgLogo, userLogo } = this.state
		return (
			<div className='Personage'>
				<div className="mindiv2">					
						<img src={userImg ? userImg : userLogo} alt="" className="minge3" /> 
					<div className="">
						<p className="minp3">{username}<img src={imgLogo} className="minge1" alt='' /></p>
						<div className="minp4">
							{/* <span className="minp5">点击更换头像</span> */}
							<Upload title="点击更换头像" />
							<span className="minp5" onClick={this.props.logout}>退出账号</span>
						</div>
					</div>
				</div>
				<div className="mindiv3">
					<div className="mindiv4 mindiv5" onClick={this.goWish}>
						<p className="minp2"><span style={{ "display": "block" }}>{wish}</span>想看</p>
					</div>
					<div className="mindiv4 mindiv5" onClick={this.goCom}>
						<p className="minp2"><span style={{ "display": "block" }}>{comment}</span>已评论</p>
					</div>
					<div className="mindiv4" onClick={this.goHis}>
						<p className="minp2"><span style={{ "display": "block" }}>{record}</span>记录</p>
					</div>
				</div>
			</div>
		)
	}
}
export default withRouter(Personage)